<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<link href="/static/css/hover-effects.css" rel="stylesheet" type="text/css">
<ul>
    <li>
        <div class="port-1 effect-1">
            <div class="image-box">
                <img src="/static/images/3.jpg" alt="Image-1">
            </div>
            <div class="text-desc">
                <h3>海贼王</h3>
                <p>路飞</p>
                <a href="#" class="btn">Learn more</a>
            </div>
        </div>
    </li>
    <li>
        <div class="port-5 effect-2">
            <div class="image-box">
                <img src="/static/images/3.jpg" alt="Image-2">
            </div>
            <div class="text-desc">
                <h3>火影忍者</h3>
                <p>名人</p>
                <a href="#" class="btn">Learn more</a>
            </div>
        </div>
    </li>
    <li>
        <div class="port-1 effect-3">
            <div class="image-box">
                <img src="/static/images/3.jpg" alt="Image-3">
            </div>
            <div class="text-desc">
                <h3>七龙珠</h3>
                <p>悟空</p>
                <a href="#" class="btn">Learn more</a>
            </div>
        </div>
    </li>
</ul>
<%--!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!--%>
<ul>
    <li>
        <div class="port-1 effect-3">
            <div class="image-box">
                <img src="/static/images/3.jpg" alt="Image-3">
            </div>
            <div class="text-desc">
                <h3>七龙珠</h3>
                <p>悟空</p>
                <a href="#" class="btn">Learn more</a>
            </div>
        </div>
    </li>
    <li>
        <div class="port-7 effect-2">
            <div class="image-box">
                <img src="/static/images/3.jpg" alt="Image-2">
            </div>
            <div class="text-desc">
                <h3>Your Title</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing.</p>
                <a href="#" class="btn">Learn more</a>
            </div>
        </div>
    </li>
    <li>
        <div class="port-4 effect-2">
            <div class="image-box">
                <img src="/static/images/3.jpg" alt="Image-2">
            </div>
            <div class="text-desc">
                <h3>Your Title</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                <a href="#" class="btn">Learn more</a>
            </div>
        </div>
    </li>
</ul>